<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
        <title>热听好书</title>
        <meta id="viewport" name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0" />
        <meta name="format-detection" content="telephone=no" />
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
        <link rel="stylesheet" type="text/css" href="css/aui.css"/>
	</head>
	<body style="background-color: #fff">
		<div class="scrollload-containernew">
             <div id="content" class="scrollload-contentnew" style="padding-bottom: 40px;overflow: hidden;"></div>
        </div>
	</body>
	<style type="text/css">
		.toFlip {
			display: none;
		}
		.txt img {
			width: 100%;
		}
	</style>
	<script id="booklist_tem" type="text/html">
		{{each bookArr}}
		<div class="col-xs-12" style="height: 1rem;width: 100%;"></div>
			<div class="col-xs-12 bookdetail" style="min-height:12rem;height:auto;width:100%;padding-left: 1.456rem;padding-right: 1.456rem;" data-bookid={{$value.bookid}} data-videoauthorid={{$value.videoauthorid}} data-copywriter={{$value.copywriter}} data-bookname={{$value.bookname}} data-bookimg={{$value.bookimg}} data-bookrecommend={{$value.bookrecommend}}>
				<div class="col-xs-4" style="height:12rem;width: 29.3333%;padding:0rem;">
					<a href="javascript:;" style="text-decoration: none;">
						<img src="{{$value.bookimg | addUrl}}" style="width: 9.17rem;height: 12rem;box-shadow: 3px 3px 3px #e6e6e6;">
						<img src="icon/listen.png" style="width: 1.66rem; height: 1.66rem; margin-top: -1.82rem; margin-left: 7.28rem;"/>
					</a>
				</div>
				<div class="col-xs-8" style="position: relative;height:12rem;width:68.666666%;top:0rem;left:0.52rem;padding: 0.2rem 0.572rem 0.5rem 0rem;">
					<span class="aui-ellipsis-2 " style="position: relative;left:0rem;margin: 0;font-size: 1.66rem;line-height:2rem;font-weight: bold;">{{$value.bookname}}</span>
					<p class="aui-ellipsis-2" style="position: relative;font-size:1.4rem;color: #666;margin-top: 0.78rem;margin-bottom: 0;">{{$value.bookrecommend}}</p>
					{{if progessArr[$index] == 0}}
					<div style="position:absolute;bottom: 0.1rem;">
						<span style="float:left;color: #999;font-size: 1.2rem;line-height: 1.3rem;margin-top: .5rem;padding-right: .46rem;">{{$value.videoduration}}</span>
					</div>
					{{else}}
					<div style="position:absolute;bottom: 0.1rem;">
						<span style="float:left;color: #999;font-size: 1.2rem;line-height: 1.3rem;margin-top: .5rem;padding-right: .46rem;">{{$value.videoduration + " " + progessArr[$index]}}</span>
					</div>
					{{/if}}
					{{if (userVip.type==1||$value.isorder==1)}}
					<div class="begin-read" data-isactivity={{$value.book_activity}} data-isorder={{$value.isorder}} data-bookid={{$value.bookid}} style="position: absolute;right: 1.4rem;bottom: 0;width: 7.8rem;height:3rem;background-image: linear-gradient(-179deg, #F7BA64 0%, #fbd454 100%);box-shadow: 0 2px 5px 0 #F8CAA7;border-radius: 10rem;text-align: center;color: #333333;font-size: 1.4rem; padding-top: 0.3rem;line-height: 2.95rem;font-weight: bold;">
						开始听书
					</div>
					{{else}}
					<div style="position: absolute;right: 0.5rem;bottom: 0.2rem;width: 7.8rem;height:1.5rem;font-size: 1.4rem; font-weight: bold; text-align: center;color: #ED8434;">
						{{"¥ " + $value.bookprice}}
					</div>
					{{/if}}
				</div>
			</div>
			<div class="col-xs-12" style="height: 1.5rem;width: 100%;"></div>
		{{/each}}
	</script>
	<script src="js/wxrem.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/aui-toast.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/out7.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/zepto.js " type="text/javascript " charset="utf-8"></script>
	<script src="js/md5.js " type="text/javascript " charset="utf-8"></script>
	<script src="js/art-template.js " type="text/javascript " charset="utf-8 "></script>
	<script src="js/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/purl.js"></script>
    <!--<script src="//s.url.cn/qqun/qun/qqweb/m/qun/confession/js/vconsole.min.js"></script>-->
	<script type="text/javascript">
		document.writeln("<script type=\"text/javascript\" src=\"js/common.js?"+ Math.random() + "\"></scr"+"ipt>");
    </script>
    <script type="text/javascript">
    	      var toast = new auiToast();
    	      var page=1;
    	      var bookArr = new Array();
    	      var refreshUpOrDown = function(){
		       var bookList_refresh = new Scrollload({
    	               container: document.querySelector('.scrollload-containernew'),
		           content: document.querySelector('.scrollload-contentnew'),
		           noMoreDataHtml : '<div id="slogen" align="center" class="col-xs-12" style="padding-bottom: 3.75rem;padding-top:2rem;height: 1.17rem; width:92%;font-size:1.4rem;left:4%">'+
			              slogenFont[rand(0,slogenFont.length)]+
						  '</div>',
                   loadMore:function(refreshUp){//上拉加载
        	               if (page >= 2) {
        	    	               getBookListUp(refreshUp);
        	               }
                   },
                   enablePullRefresh: true,
                   pullRefresh:function(refreshDown){//下拉刷新
        	           getBookListDown(refreshDown);
        	           refreshDown.refreshComplete()
                   }
                 });
	          }
			
			var getBookListUp = function(refreshUp){//上拉加载
                var sign = hex_md5(objKeySort({token:token,timestamp:date,type:0,page:page,rows:10,merchantId:merchantId}))
                $.ajax({
			              type:"get",
                            url :hostUrl + 'product/book/list/'+ token +'/'+ sign +'/'+ date + '/' + merchantId +'/0/2/'+ page +'/10',
                            async:true,
			              success:function(data){
				          if (data.status != 0 || !data.data.book_list.length) {
					       if (refreshUp) {
						       refreshUp.noMoreData()
					       }
					        return;
				          }
				         page ++;
				         data.userVip=userVip
				         bookArr = bookArr.concat(data.data.book_list);
				         if (window.localStorage) {
					var progess;
					var bookid;
					var bookCount;
					var progessStr;
					var progessArr = new Array();
					for (var i = 0; i < bookArr.length; i ++) {
						bookid = bookArr[i]["bookid"];
						bookCount = localStorage.getItem(bookid + "_count");
						bookCount = parseInt(bookCount);
						progess = 0;
						if (bookCount) {
							for (var j = 0; j < bookCount; j ++) {
								var value = localStorage.getItem(bookid + "_" + j);
								if (value) {
									var timeArr = value.split("_");
									if (timeArr.length == 2) {
										currentTime = parseInt(timeArr[0]);
			                            duration = parseInt(timeArr[1]);
			                            progess += parseInt((currentTime * 100) / duration);
									}
								}
								if (j == bookCount - 1) {
									if (progess == 0 || !progess) {
			                        	   progessStr = "0";
			                        	}else {
			                        		if (parseInt(progess / bookCount) >= 100) {
			                        			progessStr = "已听完";
			                        		}else {
			                        			progessStr = "已听" + parseInt(progess / bookCount) + "%";
			                        		}
			                        	}
			                    }
							}
						} else{
							progessStr = "0";
						}
						progessArr.push(progessStr);
					}
				}
				data.progessArr = progessArr;
				         data.bookArr = bookArr;
				         var booklist_tem = template("booklist_tem",data);
				         document.getElementById('content').innerHTML = booklist_tem;
				         if (refreshUp) {
					         refreshUp.unLock()
				         }
			          }
		           });
            }
    
    var getBookListDown = function(refreshDown){//下拉刷新
    	   
    	   toast.loading({
			title: "加载中",
			duration: 2000
		});
        var sign = hex_md5(objKeySort({token:token,timestamp:date,type:0,page:page,rows:10,merchantId:merchantId}))
        $.ajax({
			type:"get",
            url :hostUrl + 'product/book/list/'+ token +'/'+ sign +'/'+ date + '/' + merchantId + '/0/2/'+ page +'/10',
            // url:hostUrl + "product/book/list?type=2&openId=" + openId + "&rows=10&page=1",
			async:true,
			success:function(data){
				toast.hide();
				if (data.status != 0) {
					return;
				}
				page = 2;
				data.userVip=userVip
				bookArr = data.data.book_list;
				if (window.localStorage) {
					var progess;
					var bookid;
					var bookCount;
					var progessStr;
					var progessArr = new Array();
					for (var i = 0; i < bookArr.length; i ++) {
						bookid = bookArr[i]["bookid"];
						bookCount = localStorage.getItem(bookid + "_count");
						bookCount = parseInt(bookCount);
						progess = 0;
						if (bookCount) {
							for (var j = 0; j < bookCount; j ++) {
								var value = localStorage.getItem(bookid + "_" + j);
								if (value) {
									var timeArr = value.split("_");
									if (timeArr.length == 2) {
										currentTime = parseInt(timeArr[0]);
			                            duration = parseInt(timeArr[1]);
			                            progess += parseInt((currentTime * 100) / duration);
									}
								}
								if (j == bookCount - 1) {
									if (progess == 0 || !progess) {
			                        	   progessStr = "0";
			                        	}else {
			                        		if (parseInt(progess / bookCount) >= 100) {
			                        			progessStr = "已听完";
			                        		}else {
			                        			progessStr = "已听" + parseInt(progess / bookCount) + "%";
			                        		}
			                        	}
			                    }
							}
						} else{
							progessStr = "0";
						}
						progessArr.push(progessStr);
					}
				}
				data.progessArr = progessArr;
				data.bookArr = bookArr;
				var booklist_tem = template("booklist_tem",data);
				document.getElementById('content').innerHTML = booklist_tem;
				if (refreshDown) {
					refreshDown.refreshData();
					refreshDown.unLock()
				}else{
					refreshUpOrDown();
				}
			}
		});
    }
    getToken(getBookListDown);
			
			
			$("#content").on('click', '.bookdetail', function() {
				window.location.href = "bookDetail.html?bookid=" + $(this).attr('data-bookid') + "&videoauthorid=" + $(this).attr('data-videoauthorid') + "&copywriter=" + $(this).attr('data-copywriter');
			})
			$('#content').on('click','.begin-read',function(e){
				e.stopPropagation();
				e.cancelBubble=true;
				var parent=$(this).parents('.bookdetail')
				location.href = "chapter.html?bookid=" + parent.attr('data-bookid') + "&bookname="+parent.attr('data-bookname')+"&bookimg=" + parent.attr('data-bookimg')+"&videoauthorid=" + parent.attr('data-videoauthorid') + "&copywriter=" + parent.attr('data-copywriter');
			})
    </script>
</html>
